window.onload = function () {
    // 获取确认密码框后面的错误提示元素
    var confirmPasswordErrorElement = document.querySelector('.u-text[data-type="confirm-password"] .ts');

    // 设置默认提示信息
    confirmPasswordErrorElement.textContent = '请再次输入密码';
}
// 设置默认短信验证码，测试
var defaultSmsCode = '123456';

function onInputFocus(inputField) {
    hideErrorMessage(inputField);
}

function onInputChange(inputField) {
    if (inputField.classList.contains('input-field')) {
        switch (true) {
            case inputField.dataset.type === 'phone':
                var phone = inputField.value.trim();
                if (!/^\d{11}$/.test(phone)) {
                    showErrorMessage(inputField, '请输入正确的11位手机号码');
                } else {
                    hideErrorMessage(inputField);
                }
                break;
            case inputField.dataset.type === 'sms-code':
                var smsCode = inputField.value.trim();
                if (smsCode !== defaultSmsCode) {
                    showErrorMessage(inputField, '输入错误，请重新输入');
                } else {
                    hideErrorMessage(inputField);
                }
                break;
            case ['password', 'confirm-password'].includes(inputField.dataset.type):
                var password = document.querySelector('.input-field[data-type="password"]').value;
                var confirmPassword = inputField.value;

                if (inputField.dataset.type === 'confirm-password' && password !== confirmPassword) {
                    showErrorMessage(inputField, '两次输入的密码不一致');
                } else {
                    hideErrorMessage(inputField);
                }

                // 更新密码强度提示（仅在处理创建密码框时执行）
                if (inputField.dataset.type === 'password') {
                    updatePasswordStrengthUI(inputField);
                }
                break;
            default:
                hideErrorMessage(inputField); // 对于已验证通过的情况，隐藏所有错误提示
                break;
        }

        // 根据表单验证状态启用或禁用提交按钮
        enableSubmitButton(validateForm());
    }
}

function onInputBlur(inputField) {
    onInputChange(inputField);
}

function showErrorMessage(inputField, message) {
    var warningElement = inputField.nextElementSibling.querySelector('.ts');
    warningElement.textContent = message;
}

function hideErrorMessage(inputField) {
    var warningElement = inputField.nextElementSibling.querySelector('.ts');
    warningElement.textContent = '';
}


function enableSubmitButton(isValid) {
    var submitButton = document.querySelector('.res-btn');
    submitButton.disabled = !isValid;
}


// 密码强度相关函数
function evaluatePasswordStrength(password) {
    var temp = 0;
    var strength = 0;

    if (password.length >= 8) { // 密码长度至少为8
        strength += 1;
    }

    if (/[A-Z]/.test(password)) { // 包含大写字母
        strength += 1;
    }

    if (/[a-z]/.test(password)) { // 包含小写字母
        strength += 1;
    }

    if (/\d/.test(password)) { // 包含数字
        strength += 1;
    }

    if (/[!@#$%^&*(),.?":{}|<>]/.test(password)) { // 包含特殊字符
        strength += 1;
    }

    // // 确保强度值始终在0到2之间
    if (strength <= 1) {
        temp = 0;
        return temp;
    } else if (strength > 1 && strength <= 3) {
        temp = 1;
        return temp;
    } else {
        temp = 2;
        return temp;
    }
}

function updatePasswordStrengthUI(passwordField) {
    var password = passwordField.value.trim();
    var strength = evaluatePasswordStrength(password);

    // 清除所有级别的颜色
    document.querySelectorAll('.password-strength > .strength-level').forEach(function (level) {
        level.style.backgroundColor = 'transparent';
    });

    switch (strength) {
        case 0:
            // 弱密码
            document.querySelector('.weak').style.backgroundColor = 'red';
            break;
        case 1:
            // 中等密码
            document.querySelector('.weak').style.backgroundColor = 'orange';
            document.querySelector('.medium').style.backgroundColor = 'orange';
            break;
        case 2:
            // 强密码
            document.querySelector('.weak').style.backgroundColor = 'green';
            document.querySelector('.medium').style.backgroundColor = 'green';
            document.querySelector('.strong').style.backgroundColor = 'green';
            break;
    }
}

// 页面加载后初始化事件监听器并绑定至相应的输入框
window.onload = function () {
    var confirmPasswordErrorElement = document.querySelector('.u-text[data-type="confirm-password"] .ts');
    confirmPasswordErrorElement.textContent = '请再次输入密码';

    var passwordInput = document.querySelector('.input-field[data-type="password"]');
    passwordInput.addEventListener('input', function () {
        updatePasswordStrengthUI(this);
    });

    // 初始化表单元素，添加事件监听器
    document.querySelectorAll('.m-form .u-text input[type="text"], .m-form .u-text input[type="password"]').forEach(function (field) {
        field.addEventListener('focus', onInputFocus);
        field.addEventListener('input', onInputChange);
        field.addEventListener('blur', onInputBlur);
    });

    // 页面加载后执行一次表单验证，防止初始状态下按钮不可用
    enableSubmitButton(validateForm());
};